<!--
  Generated template for the FindPasswordPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->

<ion-content>
  <img class="bg" src="assets/imgs/lbg.png" alt="">
  <ion-icon tappable (click)="back()" class="back" name="md-arrow-back"></ion-icon>
  <div class="container">
    <div class="form_box center">
      <h1>找回密码</h1>
      <form [formGroup]="findPsdForm" novalidate [class.invalidForm]='invalidForm'>
          <div class="input_box" [class.error]="findPsdErrors['mobileNum']">
              <label>
                <ion-icon name="ios-phone-portrait"> </ion-icon>
              </label>
              <input type="text" formControlName="mobileNum" [(ngModel)]="params.mobile" placeholder='手机号码'>
              <p *ngIf="findPsdErrors['mobileNum']">{{findPsdErrors['mobileNum']}}</p>
            </div>
            <div class="input_box" [class.error]="findPsdErrors['phoneCode']">
              <label>
                <ion-icon name="ios-calendar-outline"></ion-icon>
              </label>
              <input type="number" class="captcha_input" [(ngModel)]="params.send_param" formControlName="phoneCode" placeholder='验证码'>
              <span class="captcha_text" (click)="sendCaptcha()" tappable>{{captchaText}}</span>
              <p *ngIf="findPsdErrors['phoneCode']">{{findPsdErrors['phoneCode']}}</p>
            </div>

            <div class="input_box" [class.error]="findPsdErrors['password']">
              <label>
                <ion-icon name="ios-lock-outline"> </ion-icon>
              </label>
              <input type="password" formControlName="password" [(ngModel)]="params.password" placeholder='密 码'>
              <p *ngIf="findPsdErrors['password']">{{findPsdErrors['password']}}</p>
            </div>
            <div class="input_box" [class.error]="findPsdErrors['rePassword']">
              <label>
                <ion-icon name="ios-unlock"> </ion-icon>
              </label>
              <input type="password" formControlName="rePassword" placeholder='再次确认密码'>
              <p *ngIf="findPsdErrors['rePassword']">{{findPsdErrors['rePassword']}}</p>
              <p *ngIf="findPsdForm.controls['rePassword'].value != findPsdForm.controls['password'].value  && findPsdForm.controls['rePassword'].dirty ">{{validationMessages['rePassword']['notMatch']}}</p>
            </div>
      </form>
      <button ion-button full tappable (click)="findPassword()">找回密码</button>
    </div>
  </div>
  <div class="cfooter">
    {{appInfo?.title+"©"}}
    <p>
      联系电话：
      <a [href]="'tel:'+appInfo?.web_phone">{{appInfo?.web_phone}}</a>
    </p>
  </div>
</ion-content>
